<template>
    <el-form
            ref="reqParam"
            label-width="120px"
            class="demo-ruleForm"
            size="default"
            status-icon
    >
        <el-form-item label="标题" prop="name">
            <el-input v-model="reqParam.title" />
        </el-form-item>
        <el-form-item label="标签" prop="type">
            <el-checkbox-group v-model="reqParam.tagIdList">
                <el-checkbox v-for="item in tagList" :label="item.id">{{ item.name }}</el-checkbox>
            </el-checkbox-group>
        </el-form-item>
        <el-form-item label="限制人数" prop="number">
            <el-input v-model="reqParam.name" />
        </el-form-item>
        <el-form-item label="活动地点" prop="name">
            <el-input v-model="reqParam.title" />
        </el-form-item>


        <el-form-item label="描述" prop="desc">
            <el-input v-model="reqParam.content" type="textarea" />
        </el-form-item>
        <el-form-item label="参与条件" prop="desc">
            <el-input v-model="reqParam.content" type="textarea" />
        </el-form-item>

        <el-upload
                v-model:file-list="fileList"
                action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
                list-type="picture-card"
                :on-preview="handlePictureCardPreview"
                :on-remove="handleRemove"
        >
            <el-icon><Plus /></el-icon>
        </el-upload>
        <!--上传-->
        <el-dialog v-model="reqParam.fileList">
            <!--            <img w-full :src="dialogImageUrl" alt="Preview Image" />-->
            <img :src="dialogImageUrl" alt="图片" />
        </el-dialog>

        <el-upload
                v-model:file-list="reqParam.fileList"
                class="upload-demo"
                action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
                multiple
                :on-preview="handlePreview"
                :on-remove="handleRemove"
                :before-remove="beforeRemove"
                :on-exceed="handleExceed"
        >
            <el-button type="primary">点击上传</el-button>
            <!--            <template #tip>-->
            <div class="el-upload__tip">
                在此上传附件
            </div>
            <!--            </template>-->
        </el-upload>

        <el-form-item>
            <el-button type="primary" @click="submitForm()">
                保存
            </el-button>
            <el-button type="primary" @click="submitForm()">
                保存并发布
            </el-button>
            <el-button @click="resetForm()">
                重置
            </el-button>
        </el-form-item>
    </el-form>
</template>

<script>
import {Plus} from "@element-plus/icons-vue";

export default {
    name: "UserDetail",
    components: {Plus}
}
</script>

<style scoped>

</style>